<!-- 福分规则管理 -->
<template>
  <page-header-wrapper>
    <a-card class="table-card">
      <GzSearchForm :searchFunc="searchFunc" :resetFunc="()=>{searchData = {};gzThreeRef.clear()}" searchConditionNum="6">
        <a-form-item class="table-search-item" label="机构名称">
          <GzTreeSelect ref="gzThreeRef" v-model:value="searchData['agentNo']" :isNeedDefault="false" />
        </a-form-item>
        <a-form-item class="table-search-item" label="规则名称">
          <a-input v-model:value="searchData['ruleName']" placeholder="规则名称" />
        </a-form-item>
        <a-form-item class="table-search-item" label="规则类型">
          <a-select v-model:value="searchData['ruleType']" placeholder="规则类型">
            <a-select-option :value="0">客户经理</a-select-option>
            <a-select-option :value="1">其他</a-select-option>
          </a-select>
        </a-form-item>
      </GzSearchForm>
  
      <!-- 列表渲染 -->
      <GzTable
        ref="infoTableRef"
        :init-data="true"
        :req-table-data-func="reqTableDataFunc"
        :table-columns="tableColumns"
        :search-data="searchData"
      >
        <template #topBtnSlot>
          <a-button v-if="$access('ENT_LIMT_CONDITION_BLACK_RULE_ADD')" type="primary" @click="addOrEditFunc(null)">
            <plus-outlined />新建
          </a-button>
        </template>
  
        <template #bodyCell="{ column, record }">
          <template v-if="column.key === 'ruleType'">{{ record.ruleType === 1 ? '其他' : '客户经理' }}</template>
          <template v-if="column.key === 'operation'">
            <a-button v-if="$access('ENT_LIMT_CONDITION_BLACK_RULE_VIEW')" type="link" @click="addOrEditFunc(record.blacklistRuleId,'look')">查看</a-button>
            <a-button v-if="$access('ENT_LIMT_CONDITION_BLACK_RULE_EDIT') && record.activityState==0" type="link" @click="addOrEditFunc(record.blacklistRuleId)">修改</a-button>
            <a-button v-if="$access('ENT_LIMT_CONDITION_BLACK_RULE_DEL')" type="link" @click="deleteFunc(record.blacklistRuleId)">删除</a-button>
          </template>
        </template>
      </GzTable>
    </a-card>
    <!-- 新增修改 -->
    <AddOrEdit ref="addOrEditRef" :callbackFunc="searchFunc" />
    <!-- 详情 -->
    <!-- <Detail ref="detailRef"/> -->
  </page-header-wrapper>
</template>
  
  <script lang="ts" setup>
  import dayjs from 'dayjs'
  import AddOrEdit from './AddOrEdit.vue'
//   import Detail from "./Detail.vue";
  import { req, API_URL_BLACKLISTRULE, API_URL_BLACKLISTRULE_REMOVE,  } from '@/api/manage'
  import { ref, reactive, getCurrentInstance } from 'vue'
  
  const { $infoBox, $access } = getCurrentInstance()!.appContext.config.globalProperties
  
  const gzThreeRef = ref()
  const infoTableRef = ref()
  const addOrEditRef = ref()
  const detailRef = ref()
  
  let tableColumns = reactive([
    { key: 'ruleName', title: '规则名称',dataIndex: 'ruleName' },
    { key: 'ruleType', title: '规则类型',dataIndex: 'ruleType' },
    { key: 'ruleTip', title: '提示语',dataIndex: 'ruleTip' },
    { key: 'agentName', title: '机构名称',dataIndex: 'agentName' },
    { key: 'createdAt', title: '创建时间',dataIndex: 'createdAt' },
    { key: 'operation', title: '操作', dataIndex: 'operation', align: 'center' }
  ])
  const searchData:any = ref({})
  
  // 请求table接口数据
  function reqTableDataFunc(params: any) {
    return req.list(API_URL_BLACKLISTRULE,params)
  }
  
  function searchFunc() {
    infoTableRef.value.refTable(true)
  }
  
  /**
   * 新增或修改
   */
  function addOrEditFunc(blacklistRuleId:any, type:any) {
    addOrEditRef.value.show(blacklistRuleId, type)
  }
  // 删除
  function deleteFunc(blacklistRuleId:any){    
    $infoBox.confirmDanger('确认删除？', '请确认是否删除当前数据？', () => {
        req.add(API_URL_BLACKLISTRULE_REMOVE, {blacklistRuleId:blacklistRuleId}).then(() => {
          $infoBox.message.success(`删除成功`)
          infoTableRef.value.refTable(true)
        })
  })
  }

  </script>
  